<template>

  <base-container>
    <div class="tabs-container" v-if="currentPageShowType == PAGE_SHOW_TYPE.LIST">
      <el-tabs v-model="currentTab">
        <el-tab-pane v-for="(item,index) in tabsData" :key="index" :label="item.label"
                     :name="item.value"></el-tab-pane>
      </el-tabs>
    </div>
    <div :class="currentPageShowType == PAGE_SHOW_TYPE.LIST ? ['content-container'] : ['content-container', 'full-container']" v-if="currentTab == TABS_CONFIG.XZGL">
      <list-page ref="listPage" v-show="currentPageShowType == PAGE_SHOW_TYPE.LIST"
                 @goInfoPage="goInfoPage"></list-page>
      <info-page @goListPage="goListPage" :current-item="currentItem"
                 v-show="currentPageShowType == PAGE_SHOW_TYPE.INFO"></info-page>
    </div>
  </base-container>

</template>

<script>
import {changePageMixins} from "@/views/business/mixins/changePageMixins";
import BaseContainer from "@/components/BaseContainer/index.vue";
import listPage from './listPage.vue'
import infoPage from './infoPage.vue'

export default {
  mixins: [changePageMixins],
  components: {
    BaseContainer,
    listPage,
    infoPage
  },
  data() {
    const TABS_CONFIG = {
      XZGL: 'XZGL'
    }
    return {
      TABS_CONFIG,
      tabsData: [
        {
          label: '险种管理',
          value: TABS_CONFIG.XZGL
        }
      ],
      currentTab: TABS_CONFIG.XZGL
    }
  }
}
</script>

<style lang="scss" scoped>
.tabs-container, .content-container {
  width: 100%;
  box-sizing: border-box;
}

.tabs-container {
  height: 5%;
}

.content-container {
  height: 95%;
}
</style>
